<template>
  <el-tree :data="menus" :props="defaultProps" node-key="catId" ref="menuTree" @node-click="nodeClick" ></el-tree>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      menus: [],
      expandedKey: [],
      defaultProps: {
        children: "children",
        label: "name"
      }
    };
  },
  methods:{
      getMenus() {
      this.$http({
        url: this.$http.adornUrl("/product/category/list/tree"),
        method: "get"
      }).then(({ data }) => {
        console.log("成功获取到菜单数据...", data.page);
        this.menus = data.page;
      });
    },
    nodeClick(data,node,component){
        // 子组件像父组件传递参数 引用者需要触发事件
        this.$emit("tree-node-click",data,node,component);
    }
  },
  created(){
      this.getMenus();
  }
};
</script>

<style>
</style>